import React, { Component } from 'react'
import './Login.modules.css'
import { Form, Input, Button, Checkbox,message } from 'antd';
// import Particles from 'react-particles-js';
import axios from 'axios'
export default class Login extends Component {

  render() {
    const onFinish = (values) => {
      // console.log('Success:', values,);
      // console.log(`/users?username=${values.username}&password=${values.password}&roleState=true&_expand=role`)
      axios.get(`/users?username=${values.username}&password=${values.password}&roleState=true&_expand=role`).then(res=>{
        // console.log(res)
        if(res.data.length===0){
            message.error("用户名或密码不匹配")
        }else{
            localStorage.setItem("token",JSON.stringify(res.data[0]))
            this.props.history.push("/")
        }
    })
    };

    const onFinishFailed = (errorInfo) => {
      // console.log('Failed:', errorInfo);
    };
    return (
      <div className="login">
        <div className='login-content'>
          <p>新闻发布管理系统</p>
          <Form
            name="basic"
            className='login-form'
            labelCol={{ span: 8 }}
            wrapperCol={{ span: 16 }}
            initialValues={{ remember: true }}
            onFinish={onFinish}
            onFinishFailed={onFinishFailed}
            autoComplete="off"
          >
            <Form.Item
              label="用户名"
              name="username"
              rules={[{ required: true, message: 'Please input your username!' }]}
            >
              <Input />
            </Form.Item>

            <Form.Item
              label="密码"
              name="password"
              rules={[{ required: true, message: 'Please input your password!' }]}
            >
              <Input.Password />
            </Form.Item>

            <Form.Item name="remember" valuePropName="checked" wrapperCol={{ offset: 8, span: 16 }}>
              <Checkbox>Remember me</Checkbox>
            </Form.Item>

            <Form.Item wrapperCol={{ offset: 8, span: 16 }}>
              <Button type="primary" htmlType="submit">
                登陆
              </Button>
            </Form.Item>
          </Form>
        </div>
      </div>
    )
  }
}
